{% extends "website/base.html" %}
{% block content %}
<section class="section">
  <div class="card">
    <div class="card-title">
      <div class="icon">🩺</div>
      <div>
        <h1 class="h1" style="margin:0">EMR Dashboard</h1>
        <div class="muted">Patients, encounters, labs, and compliance audit log</div>
      </div>
      <div style="margin-left:auto; display:flex; gap:8px; flex-wrap:wrap">
        <a class="btn btn-sm" href="{% url 'website:emr:staff_patient_list' %}">Patients</a>
        <a class="btn btn-sm" href="{% url 'website:emr:staff_audit_log' %}">Audit log</a>
      </div>
    </div>

    <div class="grid" style="grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap:12px;">
      <div class="mini-card">
        <div class="mini-top">Patients</div>
        <div class="mini-value">{{ stats.patients }}</div>
      </div>
      <div class="mini-card">
        <div class="mini-top">Encounters</div>
        <div class="mini-value">{{ stats.encounters }}</div>
      </div>
      <div class="mini-card">
        <div class="mini-top">Open encounters</div>
        <div class="mini-value">{{ stats.open_encounters }}</div>
      </div>
      <div class="mini-card">
        <div class="mini-top">Lab uploads</div>
        <div class="mini-value">{{ stats.lab_results }}</div>
      </div>
    </div>

    <div class="grid" style="grid-template-columns: 1fr 1fr; gap:12px; margin-top:14px;">
      <div class="card" style="padding:12px;">
        <div style="display:flex; align-items:center; gap:8px; justify-content:space-between;">
          <div>
            <div class="h2" style="margin:0">Recent patients</div>
            <div class="muted">Newest records</div>
          </div>
          <a class="btn btn-sm" href="{% url 'website:emr:staff_patient_create' %}">+ New</a>
        </div>
        <div style="margin-top:10px; display:flex; flex-direction:column; gap:8px;">
          {% for p in recent_patients %}
            <a class="row" href="{% url 'website:emr:staff_patient_detail' p.id %}">
              <div>
                <div style="font-weight:700">{{ p.full_name }}</div>
                <div class="muted">{{ p.email }}{% if p.phone %} · {{ p.phone }}{% endif %}</div>
              </div>
              <div class="pill">{% if p.created_at %}{{ p.created_at|date:"M d, Y" }}{% endif %}</div>
            </a>
          {% empty %}
            <div class="muted">No patients yet.</div>
          {% endfor %}
        </div>
      </div>

      <div class="card" style="padding:12px;">
        <div class="h2" style="margin:0">Recent encounters</div>
        <div class="muted">Latest clinical activity</div>

        <div style="margin-top:10px; display:flex; flex-direction:column; gap:8px;">
          {% for e in recent_encounters %}
            <a class="row" href="{% url 'website:emr:staff_encounter_detail' e.id %}">
              <div>
                <div style="font-weight:700">{{ e.patient.full_name }}</div>
                <div class="muted">{{ e.visit_datetime|date:"M d, Y H:i" }}{% if e.chief_complaint %} · {{ e.chief_complaint }}{% endif %}</div>
              </div>
              <div class="pill">{% if e.is_closed %}Closed{% else %}Open{% endif %}</div>
            </a>
          {% empty %}
            <div class="muted">No encounters yet.</div>
          {% endfor %}
        </div>
      </div>
    </div>

    <div class="card" style="padding:12px; margin-top:12px;">
      <div style="display:flex; align-items:center; justify-content:space-between; gap:8px;">
        <div>
          <div class="h2" style="margin:0">Compliance audit log</div>
          <div class="muted">Who edited what (latest 10)</div>
        </div>
        <a class="btn btn-sm" href="{% url 'website:emr:staff_audit_log' %}">View all</a>
      </div>

      <div style="margin-top:10px; display:flex; flex-direction:column; gap:8px;">
        {% for ev in recent_audit %}
          <div class="row" style="cursor:default">
            <div>
              <div style="font-weight:700">{{ ev.action|upper }} · {{ ev.model_label }} #{{ ev.object_id }}</div>
              <div class="muted">
                {% if ev.actor %}{{ ev.actor.username }}{% else %}System{% endif %}
                · {{ ev.created_at|date:"M d, Y H:i" }}
                {% if ev.ip_address %} · {{ ev.ip_address }}{% endif %}
              </div>
            </div>
            <div class="pill">{{ ev.object_repr }}</div>
          </div>
        {% empty %}
          <div class="muted">No audit events yet.</div>
        {% endfor %}
      </div>
    </div>

  </div>
</section>
{% endblock %}